<template>
	<view class="snowy-form">
		<uni-forms ref="formRef" :model="formData" :rules="rules" validate-trigger="blur" label-align="left"
			labelWidth="auto">
			<uni-forms-item label="用户名" name="username" required :rules="[{ required: true, errorMessage: '请输入用户名' }]">
				<uni-easyinput v-model="formData.username" placeholder="请输入用户名"></uni-easyinput>
			</uni-forms-item>
			<uni-forms-item label="手机" name="phone">
				<uni-easyinput v-model="formData.phone" placeholder="请输入手机"></uni-easyinput>
			</uni-forms-item>
			<uni-forms-item label="姓名" name="realname">
				<uni-easyinput v-model="formData.realname" placeholder="请输入姓名"></uni-easyinput>
			</uni-forms-item>
			<uni-forms-item label="性别" name="sex">
				<uni-data-checkbox v-model="formData.sex" :localdata="genderOptions" />
			</uni-forms-item>
			<uni-forms-item label="生日" name="birthday">
				<uni-datetime-picker type="date" return-type="string" format="YYYY-MM-DD" v-model="formData.birthday" />
			</uni-forms-item>
			<uni-forms-item label="邮箱" name="email">
				<uni-easyinput v-model="formData.email" placeholder="请输入邮箱"></uni-easyinput>
			</uni-forms-item>
			<!-- <uni-forms ref="dynamicFormRef" :model="dynamicFormData"  label-width="auto"
				label-align="left">
				<snowy-dyna-field v-for="(item, index) in dynamicFieldConfigList" :key="index" :index="index"
					:fieldConfig="item" :formData="dynamicFormData" />
			</uni-forms> -->
		</uni-forms>
		<tui-button margin="50rpx 0" :preventClick="true" :shadow="true" @click="submit">保存</tui-button>
	</view>
</template>
<script setup>
	import userCenterApi from '@/api/sys/user-center-api'
	import dynaApi from '@/api/dev/dyna.js'
	import {
		reactive,
		ref
	} from "vue"
	import {
		onLoad,
		onReady
	} from '@dcloudio/uni-app'
	import store from '@/store/index.js'
	import dictApi from '@/api/dev/dict-api'
	let genderOptions = ref([])// 性别
	const formRef = ref()
	const formData = ref(uni.$xeu.clone(store.getters.userInfo, true))
	const moduleCode = ref('sale')
	const businessCode = ref('bill')
	
	const rules = reactive({
		phone: {
			rules: [{
				pattern: /^(13[0-9]|14[579]|15[0-3,5-9]|16[6]|17[0135678]|18[0-9]|19[89])\d{8}$/,
				errorMessage: '请填写符合要求的11位手机号'
			}]
		},
		email: {
			rules: [{
				pattern: /^[a-zA-Z0-9_-]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/,
				errorMessage: '请填写正确的邮箱号',
			}, ]
		},
	})

	//todo 怎么包装为一个函数的返回值
	dictApi.dictList('sex').then(data =>{
		genderOptions.value = data
	})
	
	// 动态表单
	// const dynamicFormRef = ref()
	// const dynamicFieldConfigList = ref([])
	// const dynamicFormData = ref({})
	// dynaApi.getFormSchemas({moduleCode:moduleCode.value,businessCode:businessCode.value}).then(data => {
	// 	dynamicFieldConfigList.value = data || []
	// })

	// 提交
	const submit = () => {
		formRef.value.validate().then(res => {
			userCenterApi.userUpdateUserInfo({...formData.value/**,...dynamicFormData.value*/}).then(data => {
				// 更新缓存
				store.commit('SET_userInfo', formData.value)
			})
		})
	}
</script>
<style lang="scss" scoped>
</style>